﻿<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:s="http://schemas.microsoft.com/surface/2008"
                    xmlns:controls="clr-namespace:WinwiseARDrone.TouchScreenClient.Controls">

    <Style TargetType="{x:Type controls:HalfMoonSelector}">
        <Style.Resources>
            <ImageBrush x:Key="SelectorBackground" ImageSource="pack://application:,,,/WinwiseARDrone.TouchScreenClient;component/Assets/SelecteurFond.png"/>

            <Storyboard x:Key="RightAnimation">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" Storyboard.TargetName="aiguille">
                    <SplineDoubleKeyFrame KeyTime="0:0:0.3" Value="35"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
            <Storyboard x:Key="LeftAnimation">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Angle)" Storyboard.TargetName="aiguille">
                    <SplineDoubleKeyFrame KeyTime="0:0:0.3" Value="-35"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </Style.Resources>

        <Setter Property="Height" Value="122"/>
        <Setter Property="Width" Value="215"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type controls:HalfMoonSelector}">
                    <Grid Background="{StaticResource SelectorBackground}">
                        
                        <!-- Aiguille -->
                        
                        <Image x:Name="aiguille"
                               Source="pack://application:,,,/WinwiseARDrone.TouchScreenClient;component/Assets/SelecteurAiguille.png"
                               VerticalAlignment="Bottom"
                               HorizontalAlignment="Center"
                               Height="90"
                               Margin="0,0,0,4"
                               RenderTransformOrigin="0.5,0.85">
                            <Image.RenderTransform>
                                <RotateTransform Angle="35"/>
                            </Image.RenderTransform>
                        </Image>
                        
                        <!-- Bouton gaucher -->
                        
                        <s:SurfaceButton x:Name="ctlButtonLeft"
                                         VerticalAlignment="Bottom"
                                         HorizontalAlignment="Left"
                                         Margin="0,0,0,-2">
                            <s:SurfaceButton.Template>
                                <ControlTemplate>
                                    <Grid Width="55"
                                          Height="45">
                                        <Image x:Name="StateImageNormal" 
                                               Source="pack://application:,,,/WinwiseARDrone.TouchScreenClient;component/Assets/SelecteurGauche.png" />
                                        <Image x:Name="StateImagePressed" 
                                               Visibility="Collapsed"
                                               Source="pack://application:,,,/WinwiseARDrone.TouchScreenClient;component/Assets/SelecteurGaucheTouch.png" />
                                    </Grid>
                                    <ControlTemplate.Triggers>
                                        <Trigger Property="ToggleButton.IsPressed" Value="True">
                                            <Setter TargetName="StateImageNormal" Property="Visibility" Value="Collapsed"/>
                                            <Setter TargetName="StateImagePressed" Property="Visibility" Value="Visible"/>
                                        </Trigger>
                                    </ControlTemplate.Triggers>
                                </ControlTemplate>
                            </s:SurfaceButton.Template>
                        </s:SurfaceButton>
                        
                        <!-- Bouton droitier-->

                        <s:SurfaceButton x:Name="ctlButtonRight"
                                         VerticalAlignment="Bottom"
                                         HorizontalAlignment="Right"
                                         Margin="0,0,0,-2">
                            <s:SurfaceButton.Template>
                                <ControlTemplate>
                                    <Grid Width="55"
                                          Height="45">
                                        <Image x:Name="StateImageNormal" 
                                               Source="pack://application:,,,/WinwiseARDrone.TouchScreenClient;component/Assets/SelecteurDroit.png" />
                                        <Image x:Name="StateImagePressed" 
                                               Visibility="Collapsed"
                                               Source="pack://application:,,,/WinwiseARDrone.TouchScreenClient;component/Assets/SelecteurDroitTouch.png" />
                                    </Grid>
                                    <ControlTemplate.Triggers>
                                        <Trigger Property="ToggleButton.IsPressed" Value="True">
                                            <Setter TargetName="StateImageNormal" Property="Visibility" Value="Collapsed"/>
                                            <Setter TargetName="StateImagePressed" Property="Visibility" Value="Visible"/>
                                        </Trigger>
                                    </ControlTemplate.Triggers>
                                </ControlTemplate>
                            </s:SurfaceButton.Template>
                        </s:SurfaceButton>
                    </Grid>
                    
                    <!-- Triggers -->
                    
                    <ControlTemplate.Triggers>
                        <EventTrigger SourceName="ctlButtonRight" RoutedEvent="Button.Click">
                            <BeginStoryboard>
                                <Storyboard>
                                    <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="(controls:HalfMoonSelector.IsRigthSelected)">
                                        <DiscreteBooleanKeyFrame KeyTime="0" Value="True"/>
                                    </BooleanAnimationUsingKeyFrames>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>
                        <EventTrigger SourceName="ctlButtonLeft" RoutedEvent="Button.Click">
                            <BeginStoryboard>
                                <Storyboard>
                                    <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="(controls:HalfMoonSelector.IsRigthSelected)">
                                        <DiscreteBooleanKeyFrame KeyTime="0" Value="False"/>
                                    </BooleanAnimationUsingKeyFrames>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>
                        <EventTrigger RoutedEvent="controls:HalfMoonSelector.LeftSelected">
                            <BeginStoryboard Storyboard="{StaticResource LeftAnimation}"/>
                        </EventTrigger>
                        <EventTrigger RoutedEvent="controls:HalfMoonSelector.RightSelected">
                            <BeginStoryboard Storyboard="{StaticResource RightAnimation}"/>
                        </EventTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</ResourceDictionary>